<template>
  <div class="select-subsidy">
    <span style="margin-right: 8px">
      补贴兑付年份:
      <a-dropdown :disabled="years.length === 1">
        <a-button style="margin-left: 4px">
          {{ currentYear }}
          <a-icon type="down" />
        </a-button>
        <a-menu slot="overlay">
          <a-menu-item
            v-for="item in years"
            :key="item.label"
            @click="handlerChangeYear(item)"
          >
            {{ item.label }}
          </a-menu-item>
        </a-menu>
      </a-dropdown>
    </span>

    补贴项目:
    <a-dropdown :disabled="projects.length === 1">
      <a-button style="margin-left: 4px">
        {{ currentProjects.task_nam || defaultTask }}
        <a-icon type="down" />
      </a-button>
      <a-menu slot="overlay">
        <a-menu-item
          v-for="item in projects"
          :key="item.task_id"
          @click="handlerChangeProject(item)"
        >
          {{ item.task_nam }}
        </a-menu-item>
      </a-menu>
    </a-dropdown>
  </div>
</template>

<script>
import { userModule } from '@/store/modules/user'

export default {
  data () {
    return {
      defaultTask: '--选择当前有权操作的补贴项目--'
    }
  },
  computed: {
    projects () {
      return userModule.projects
    },
    currentProjects () {
      return userModule.currentProject
    },
    years() {
      return userModule.years
    },
    currentYear() {
      return userModule.currentYear
    }
  },
  mounted () {
    
    this.initYear();

    // 仅仅只有1个时默认加载
    this.$nextTick(() => {
      this.initProject();
    })
  },
  methods: {
    handlerChangeProject (item) {
      userModule.SET_CURRENT_PROJECT(item)
      // 持久化缓存项目ID
      localStorage.setItem('LOCAL_TASK_ID', item.task_id);
      console.log(this.$route.path, '111')
      if (this.$route.path !== '/common/welcome' && this.$route.path !== '/statistics/echarts') {
        this.$router.push({ path: '/' })
      }
    },

    handlerChangeYear(year) {
      if (localStorage.getItem('LOCAL_CURRENT_YEAR') === year.label) return
      userModule.SET_CURRENT_YEAR(year)
      // 持久化缓存项目ID
      localStorage.setItem('LOCAL_CURRENT_YEAR', `${year.label}`)
      if (window._api?.change?.url && window._api?.change?.handler?.(year.label)) {
        window.location.href = window._api?.change?.url
      }
    },

    initYear() {
      /**
       * @todo 切换年限
       * 1、获取LOCAL_CURRENT_YEAR的值和this.currentYear 作为currentYear初值
       * 2、如果currentYear有值，则判断当前years里边是否包含指定年限，如有则取当前年限，否则取最新的一年
       * 3、如果currentYear没有值，则取最新的一年当做默认年份
      */
      if (this.years.length) {
        // 默认加载最后一年
        let year = this.years[this.years.length - 1];
        // 提取持久化保存的年份
        const LOCAL_CURRENT_YEAR = localStorage.getItem('LOCAL_CURRENT_YEAR');
        const currentYear = LOCAL_CURRENT_YEAR ? +LOCAL_CURRENT_YEAR : this.currentYear
        if (currentYear) {
          const value = this.years.find(item => item.label === currentYear)
          if (value) {
            year = value;
            console.info("加载已缓存年份 =>", year.label);
          }
        }
        console.info("当前加载年份 =>", year.label);
        this.handlerChangeYear(year)
      } else {
        console.warn("当前数据无年份数据，请确认!")
      }
    },

    initProject() {
      /**
       * @todo 切换项目
       * 1、获取LOCAL_TASK_ID的值和this.currentProjects.task_id 作为currentYear初值
       * 2、如果currentProjects有值，则判断当前projects里边是否包含指定项目，如有则取当前项目，否则取取第一个项目当做默认项目
       * 3、如果currentProjects没有值，则取第一个项目当做默认项目
      */
      if (this.projects.length) {
        // 默认加载第一个项目
        let project = this.projects[0];
        const LOCAL_TASK_ID = localStorage.getItem('LOCAL_TASK_ID');
        const currentTaskId = LOCAL_TASK_ID ? LOCAL_TASK_ID : this.currentProjects?.task_id;
        if (currentTaskId) {
          const value = this.projects.find(item => item.task_id === currentTaskId)
          if (value) {
            project = value;
            console.info("加载已缓存项目 =>", project.task_nam);
          }
        }
        console.info("当前加载项目 =>", project.task_nam);
        this.handlerChangeProject(project)
      } else {
        console.warn("当前数据无项目数据，请确认!")
      }
    }
  }
}
</script>

<style lang="less" scoped>
.select-subsidy {
  margin: 0 10px;
  /deep/ .ant-btn {
    background: none;
  }
}
</style>
